<template>
  <div class="flex bottom-btn">
    <div class="flex-item v-align-c back" @click="$pt.navigateBack({delta:-1})">
      <div class="width-per-100 align-c">返回上级</div>
    </div>
    <div class="flex-item v-align-c save" :style="{backgroundColor: globelStyle.color2, color: globelStyle.styleType === 10 ? globelStyle.color4 : '#fff'}" @click="save">
      <div class="width-per-100 align-c">保存设置</div>
    </div>
  </div>
</template>

<script>
  export default {
    props: {
      globelStyle: {
        type: Object,
        default: function() {
          return {}
        }
      }
    },
    data() {
      return {
        isComponents: true,
        getAppInfo: {},
        globalStyle: {}
      }
    },
    mounted() {
      this.getAppInfo = this.$pt.getStorageSync('appInfo')
      this.globalStyle = this.getAppInfo.style
    },
    methods: {
      save() {
        this.$emit('save')
      }
    }
  }
</script>

<style scoped>
.bottom-btn {
  width: 100%;
  position: fixed;
  bottom: 0;
  z-index: 100;
}

.bottom-btn .back {
  background-color: #f6f6f6;
  height: 50px;
}

.bottom-btn .save {
  /* background-color: #f8c400; */
  height: 50px;
}
</style>
